<template id='Coming'>
  <div class="Coming">
    <img :src="pcImg" class="pcImg" />
    <img :src="phoneImg" class="phoneImg" />
  </div>
</template>

<script>
export default {
  name: "Coming",
  components: {},
  data() {
    return {
      pcImg: require("@/assets/images/coming/comingPc.jpg"),
      phoneImg: require("@/assets/images/coming/comingPhone.jpg"),
    };
  },
};
</script>

<style lang='less' scoped>
.Coming {
  margin-top: -220px;
  .pcImg {
    display: block;
    width: 1920px;
    height: 1080px;
  }
  .phoneImg {
    width: 100%;
    display: none;
  }
}
@media screen and (max-width: 450px) {
  .Coming {
    .pcImg {
      display: none;
    }
    .phoneImg {
      display: block;
    }
  }
}
</style>